import { Module } from 'vuex'
import { IRootState } from '@/store/type'
import { ISongList } from './type'
import { songListInfoRequest, searchSongRequest } from '@/service/home/home'
import cache from '@/utils/cache/cache'
const songListModule: Module<ISongList, IRootState> = {
  namespaced: true,
  state() {
    return {
      songListInfoData: {},
      songListData: {},
      isPlay: true,
      isShowLyric: true,
      songLyricData: {},
      presentTime: 0,
      songItem: [],
      songItemAl: [],
      songItemIndex: 999999999999,
      singerColumn: [],
      isMP: true
    }
  },
  getters: {
    getDataInfoList(state) {
      return (pageName: any) => {
        switch (pageName) {
          case '/playlist/detail':
            return state.songListInfoData
            break
          case '/playlist/track/all':
            return state.songListData
            break
          case '/lyric':
            return state.songLyricData
            break
        }
      }
    }
  },
  mutations: {
    //控制底部播放模块的加载
    changeIsMP(state, payLoad: boolean) {
      state.isMP = payLoad
    },
    //点击获取的歌曲信息，专辑信息，歌手
    changeSongItemInfo(state, queryInfo: any) {
      const { songItem, songItemAl, songItemIndex } = queryInfo
      state.songItem = songItem
      state.songItemAl = songItemAl
      state.songItemIndex = songItemIndex
    },
    //修改歌曲当前播放的时间
    changePresentTime(state, time: number) {
      state.presentTime = time
    },
    //控制显示歌词还是歌盘
    changeIsShowLyric(state) {
      state.isShowLyric = !state.isShowLyric
    },
    //控制暂停播放按钮
    changeIsPlayT(state) {
      state.isPlay = true
    },
    changeIsPlayF(state) {
      state.isPlay = false
    },
    //歌单详情
    changeSongInfoListData(state, payLoad) {
      state.songListInfoData = payLoad
    },
    //歌单的歌曲列表
    changeSongListData(state, payLoad) {
      state.songListData = payLoad
    },
    //歌单的歌曲歌词
    changeSongLyricData(state, payLoad) {
      state.songLyricData = payLoad
    },
    //歌手的歌曲列表
    changeSingerColumnData(state, payLoad) {
      state.singerColumn = payLoad
    }
  },
  actions: {
    //获取歌单详情
    async getSongInfoList({ commit }, payLoad: any) {
      const { pageName, id, loading } = payLoad
      const songListData = await songListInfoRequest(pageName, id, loading)
      switch (pageName) {
        case '/playlist/detail':
          cache.setCache('dataInfoList', songListData.playlist)
          commit('changeSongInfoListData', songListData.playlist)
          break
        case '/playlist/track/all':
          cache.setCache('dataList', songListData.songs)
          commit('changeSongListData', songListData.songs)
          break
        case '/lyric':
          cache.setCache('songLyric', songListData.lrc.lyric)
          commit('changeSongLyricData', songListData.lrc.lyric)
      }
    },
    async getSearchSongList({ commit }, payLoad: any) {
      const { pageName, keywords, loading } = payLoad
      const searchSongData = await searchSongRequest(pageName, keywords, loading)
      console.log(searchSongData.result.songs)

      cache.setCache('dataList', searchSongData.result.songs)
      commit('changeSongListData', searchSongData.result.songs)
      //是否有值判断搜索列表是否渲染
      commit('changeSingerColumnData', searchSongData.result.songs)
    },

    setStore({ commit }) {
      commit('changeSongInfoListData', cache.getCache('dataInfoList'))
      commit('changeSongListData', cache.getCache('dataList'))
    }
  }
}
export default songListModule
